﻿@page "/"
@namespace BlazorDemo.ServerSide.Pages
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <base href="/"/>

    <meta property="og:url" content="https://dxpr.es/2WogLq7"/>
    <meta property="og:type" content="website"/>
    <meta property="og:title" content="Native Blazor Components powered by DevExpress"/>
    <meta property="og:description" content="DevExpress UI for Blazor ships with native user interface components (including a Data Grid, Pivot Grid, Charts and Scheduler) so you can design rich user experiences with both Blazor."/
    <meta property="og:image" content="https://static.devexpress.com/Products/Blazor/blazor-components-grid-pivot-scheduler-charts-editor-devexpress.jpg"/>

    <link rel="stylesheet" href="_content/BlazorDemo/css/switcher-resources/themes/blazing berry/bootstrap.min.css" id="currentTheme">
    <link rel="prefetch" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.6/styles/default.min.css" as="style">
    <link rel="prefetch" href="_content/BlazorDemo/css/scroll-view.css" as="style">

    <link rel="stylesheet" href="_content/BlazorDemo/css/dx-demo.css">
    <link rel="stylesheet" href="_content/DevExpress.Blazor/dx-blazor.css">


    <environment include="ServerSide">
        <link rel="preload" href="_framework/blazor.server.js" as="script">
    </environment>
    <environment include="Wasm.AspNetCoreHosted, Wasm.AspNetCorePrerender">
        <link rel="preload" href="_framework/blazor.webassembly.js" as="script">
    </environment>
    <environment include="Wasm.AspNetCoreHosted">
        <style>
            .mt-2 {
                margin-top: .5rem
            }

            .mt-4 {
                margin-top: 1.5rem
            }

            body {
                margin: 0;
            }

            .loading-font {
                font-family: "Segoe UI",Roboto,"Helvetica Neue","-apple-system",BlinkMacSystemFont,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
                font-size: .88rem;
                font-weight: 400;
                line-height: 1.5;
                text-align: left;
            }

            .loading-items-center {
                align-items: center;
                justify-content: center;
                display: flex;
            }

            .loading-border-primary {
                border-color: #bfbfbf;
            }

            .loading {
                width: 140px;
                height: 140px;
            }

            .loading-caption {
                font-size: 1.5rem;
                font-weight: 600;
            }
            .loading-border {
                border-width: 4px;
                border-style: solid;
            }

            .loading-image-wrapper {
                width: 120px;
                height: 120px;
                opacity: 0;
            }
        </style>
    </environment>
</head>
<body>
    @{
        var isInternetExplorer = Request.Headers["User-Agent"]
            .Any(userAgent => userAgent.Contains("MSIE") || userAgent.Contains("Trident"));
    }
    @if (isInternetExplorer) {
        <component type="typeof(BlazorDemo.Shared.IENotSupported)" render-mode="Static" />
    } else {
        <script type="text/javascript" src="_content/BlazorDemo/bootstrapper.js" defer></script>
        <app>
            <environment include="ServerSide,Wasm.AspNetCorePrerender">
                <component type="typeof(BlazorDemo.App)" render-mode="ServerPrerendered" />
            </environment>
            <environment include="Wasm.AspNetCoreHosted">
                <div id="applicationLoadingPanel" class="loading-items-center loading-font" style="height: 100vh; width: 100vw; background-color: #fff;">
                    <div class="loading-items-center" style="flex-direction: column">
                        <div class="loading position-relative loading-items-center" style="position: relative">
                            <div class="loading-border border-secondary" style="position: absolute; border-color: #d9d9d9; height: 100%; width: 100%; border-radius: 50%"></div>
                            <div class="spinner-border loading-boarder border-primary loading-border-primary" style="position: absolute; height: 100%; width: 100%; border-radius: 50%; border-left-color: transparent !important; border-right-color: transparent !important; border-bottom-color: transparent !important"></div>
                            <div id="loadingBackground" class="loading-image-wrapper text-white bg-primary loading-items-center" style="color: #fff; border-radius: 50%"></div>
                        </div>
                        <div class="loading-caption mt-4">DevExpress UI for Blazor</div>
                        <div class="loading-sm-text text-muted mt-2" style="color: #a1a1a1">Loading...</div>
                    </div>
                </div>
            </environment>
        </app>
    }
</body>
</html>
